import React from "react";
import Head from "../../components/home-header/index";
import Head1 from "../../components/home-header/second";
import Head2 from "../../components/home-header/third";
import Head3 from "../../components/home-header/four";
// 图表
import Zhe from "../../components/echarts/first";
import Zhu from "../../components/echarts/second";
// 饼图
import Pie1 from "../../components/echarts/Pie1";
import Pie2 from "../../components/echarts/pie2";
import Pie3 from "../../components/echarts/pie3";
type Props = {};
const Home = (props: Props) => {
  return (
    <div className="home">
      <header>
        {/* 组件 */}
        <Head></Head>
        <Head1></Head1>
        <Head2></Head2>
        <Head3></Head3>
      </header>
      <main>
        <div className="left">
          <Zhe></Zhe>
        </div>
        <div className="right">
          <Zhu></Zhu>
        </div>
      </main>
      <footer>
        <div
          style={{
            height: "50px",
            width: "100%",
            display: "flex",
            alignItems: "center",
            justifyContent: "space-around",
          }}
        >
          <p>今日订单状态占比</p>
          <p>今日支付方式对比</p>
          <p>今日热门出发到达城市</p>
        </div>
        <div className="pies">
          <Pie1></Pie1>
          <Pie2></Pie2>
          <Pie3></Pie3>
        </div>
      </footer>
    </div>
  );
};

export default Home;
